<template>
	<view class="WithdrawMoney">
		<view class="top">
			<text style="">USDT余额：</text>
			<text style="color:#03AD8F;">{{currdata.balance}}</text>
		</view>
		<view class="list">
			<view class="money">
				<text class="">提币地址：</text>
				<view class="input_box">
					<input style="flex:1;font-size: 13px;" v-model="address" type="text" placeholder="请输入提币地址">
					<!-- <view class="right">
						<text>USDT</text>
						<text>|</text>
						<text style="color:#1D7BFF;" @click="all">全部</text>
					</view> -->
				</view>
			</view>
			<view class="money">
				<text class="">提币数量：</text>
				<view class="input_box">
					<input style="flex:1;font-size: 13px;" v-model="number" type="number" placeholder="请输入提币数量(500的整数倍)">
					<view class="right">
						<text>USDT</text>
						<!-- <text>|</text>
						<text style="color:#1D7BFF;" @click="all">全部</text> -->
					</view>
				</view>
			</view>
			<view class="money">
				<text class="">手续费：</text>
				<view class="input_box">
					<text>{{charge}}</text>
					<text>USDT</text>
				</view>
			</view>
			<view class="money">
				<text class="">到账数量：</text>
				<view class="input_box">
					<text>{{account}}</text>
					<text>USDT</text>
				</view>
			</view>
			<view class="branch">
				<text class="iconfont">&#xe614;</text>
				当前管理分：<text style="color:#D14B64;">{{currdata.leader_score}}</text>
			</view>
			<view class="branch">
				<text style="color:#D14B64;">注：</text>
				<text>当管理分为0时，不能提现</text>
			</view>
		</view>

		<view class="btn">
			<button type="primary" @click="showBottomPopup" data-position="bottom">确定</button>
		</view>

		<uni-popup :show="showPopupBottom" :type="popType" v-on:hidePopup="hidePopup">
			<view class="bottom-popup">
				<text class="title">密码验证</text>
				<view class="input">
					<m-input class="m-input" type="password" displayable v-model="password" placeholder="请输入交易密码"></m-input>
				</view>
				<button type="primary" @click="save" style="margin: 10px 0;">确定</button>
			</view>
		</uni-popup>
	</view>
</template>
<script>
	import uniPopup from '../../components/uni-popup.vue';
	import mInput from '../../components/m-input.vue';
	export default {
		data() {
			return {
				address: '', //提币地址
				number: '', //提币数量
				charge: '0', //手续费
				chargex: 0.01, //手续费率
				account: '0', //到账数量 WithdrawMoney
				balance: '0000.0000',
				currdata: [],
				showPopupBottom: false,
				popType: 'middle',
				password: '', //交易密码
			};
		},
		components: {
			uniPopup,
			mInput
		},
		onLoad: function() {
			this.getData();
		},
		methods: {
			//统一的关闭popup方法
			hidePopup: function() {
				this.showPopupBottom = false;
			},
			//展示底部 popup
			showBottomPopup: function() {
				// if (this.currdata.leader_score <= 0) {
				// 	uni.showToast({
				// 		icon: 'none',
				// 		title: '管理分为0，不能提现'
				// 	});
				// 	return;
				// }
				if (!this.address) {
					uni.showToast({
						icon: 'none',
						title: '请输入提币地址'
					});
					return;
				}
				console.log(Math.floor(this.number/500),Math.floor(this.number/500)*500)
				if (Math.floor(this.number/500) <=0 || this.number != Math.floor(this.number/500)*500) {
					uni.showToast({
						icon: 'none',
						title: '提币数量为500的整数倍'
					});
					return;
				}
				this.hidePopup();
				this.popType = 'bottom';
				this.showPopupBottom = true;
			},
			save: function() {
				if (!this.password) {
					uni.showToast({
						icon: 'none',
						title: '请输入交易密码'
					});
					return;
				}
				//用户提币
				const data = {
					cid: 6,
					money: this.number,
					address: this.address,
					password:this.password
				}
				this.$request.post("/api/wallet/withdraw", {
						data: data
					})
					.then(res => {
						uni.showToast({
							icon: 'none',
							title: res.data.msg
						});
						if (res.data.code == 1) {
							// 跳转到其他页面
							uni.navigateTo({
								url: './success?type=提币成功'
							})
						}
					}).catch(error => {
						uni.showToast({
							icon: 'none',
							title: '网络出错,请重新提交!'
						});
					});
			},
			all: function() {
				this.number = this.currdata.balance
			},
			getData: function() {
				const _this = this;
				//获取币种详情
				const data = {
					curr_id: 6
				}
				this.$request.post("/api/index/getCurrDetail", {
						data: data
					})
					.then(res => {
						if (res.data.code == 1) {
							_this.currdata = res.data.data;
						}
					})
			}
		},
		watch: {
			number: function(number) {
				this.charge = number * (this.currdata.fee/100)
				this.account = number - number * (this.currdata.fee/100)
			}
		}
	}
</script>

<style lang="less">
	@import '../../common/iconfont.css';

	.WithdrawMoney {
		width: 100%;
		display: flex;
		flex-direction: column;

		.top {
			display: flex;
			height: 60px;
			border-top: 5px solid #F1F1F1;
			align-items: center;
			justify-content: flex-start;
			padding: 0 40upx;
			font-size: 16px;
			border-bottom: 10px solid #F1F1F1;
		}

		.list {
			padding: 0 40upx;
			font-size: 16px;
			flex: 1;

			.money {
				display: flex;
				flex-direction: column;
				padding: 10px 0;
				font-size: 15px;
				border-bottom: 1px solid #F1F1F1;
				color: #24435D;

				.input_box {
					display: flex;
					height: 40px;
					align-items: center;
					justify-content: space-between;

					// .right {
					// 	width: 30%;
					// 	display: flex;
					// 	justify-content: space-around;
					// }
				}
			}

			.branch {
				padding-top: 10upx;
				font-size: 12px;
				height: 20px;
				display: flex;
				align-items: center;
				color: #152836;

				.iconfont {
					color: #D14B64;
					display: flex;
					align-items: center;
					margin-right: 5px;
				}
			}
		}

		.btn {
			height: 60px;
			width: 80%;
			margin: 0 auto 10px;
		}
	}

	.bottom-popup {
		width: 90%;
		margin: 0 auto;

		.title {
			line-height: 60px;
		}

		.input {
			border-bottom: 1px solid #F1F1F1;
			font-size: 14px;
		}
	}
</style>
